﻿<%@ Page Title="" Language="C#" MasterPageFile="~/TemplateAdmin.Master" AutoEventWireup="true" CodeBehind="NewProduct.aspx.cs" Inherits="Photocopy.NewProduct" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <%--<script type="text/javascript" src="Scripts/bootstrap-filestyle.min.js"> </script>--%>
    <link href="Content/datepicker.css" rel="stylesheet" />
    <script src="Scripts/bootstrap-datepicker.js"></script>

    <style type="text/css">
 
        #modalContainer {
	        background-color:transparent;
	        position:absolute;
	        width:100%;
	        height:100%;
	        top:0px;
	        left:0px;
	        z-index:10000;
        }
 
        #alertBox {
	        position:relative;
	        width:300px;
	        min-height:100px;
	        margin-top: 200px;
            border: 1px solid rgba(0,0,0,.2);
            border-radius: 6px;
            background-color: #fff;
        }
 
        #modalContainer > #alertBox {
	        position:fixed;
        }
 
        #alertBox h1 {
	        margin:0;
	        font-weight: bold;
            font-size: 16px;
            background-color: #f0ad4e;
            color: #FFF;
            border-bottom: 1px solid #eee;
            border-top-left-radius: 6px;
            border-top-right-radius: 6px;
            padding: 10px;
        }
 
        #alertBox p {
	        height: 30px;
            text-align: center;
            margin-top: 10px;
       
        }
 
        #alertBox #closeBtn {
	        display:block;
	        position:relative;
	        margin: 10px auto;
            padding: 4px;
            border: 1px solid #eee;
            border-radius: 4px;
            width: 20%;
            text-transform: uppercase;
            text-align: center;
            vertical-align: middle;
            color: #000;
            background-color: #fff;
            text-decoration:none;
        }
        #alertBox #closeBtn:hover{
            color: #333;
            background-color: #ebebeb;
            border-color: #adadad;
        }
 
        /* unrelated styles */
 
        #mContainer {
	        position:relative;
	        width:600px;
	        margin:auto;
	        padding:5px;
	        border-top:2px solid #000;
	        border-bottom:2px solid #000;
	        font:0.7em verdana,arial;
        }

    </style>

    <script type="text/javascript">

        var ALERT_TITLE = "Thông báo";
        var ALERT_BUTTON_TEXT = "Ok";

        if (document.getElementById) {
            window.alert = function (txt) {
                createCustomAlert(txt);
            }
        }

        function createCustomAlert(txt) {
            d = document;

            if (d.getElementById("modalContainer")) return;

            mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
            mObj.id = "modalContainer";
            mObj.style.height = d.documentElement.scrollHeight + "px";

            alertObj = mObj.appendChild(d.createElement("div"));
            alertObj.id = "alertBox";
            if (d.all && !window.opera) alertObj.style.top = document.documentElement.scrollTop + "px";
            alertObj.style.left = (d.documentElement.scrollWidth - alertObj.offsetWidth) / 2 + "px";
            alertObj.style.visiblity = "visible";

            h1 = alertObj.appendChild(d.createElement("h1"));
            h1.appendChild(d.createTextNode(ALERT_TITLE));

            msg = alertObj.appendChild(d.createElement("p"));
            //msg.appendChild(d.createTextNode(txt));
            msg.innerHTML = txt;

            btn = alertObj.appendChild(d.createElement("a"));
            btn.id = "closeBtn";
            btn.appendChild(d.createTextNode(ALERT_BUTTON_TEXT));
            btn.href = "#";
            btn.focus();
            btn.onclick = function () { removeCustomAlert(); return false; }

            alertObj.style.display = "block";

        }

        function removeCustomAlert() {
            document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer"));
        }
    </script>

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

   
    <form runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <ul class="nav nav-tabs info-tabs">
            <li class="active"><a href="#general" data-toggle="tab">Thông tin chính</a></li>
            <li><a href="#options" data-toggle="tab">Chức năng</a></li>
            <li><a href="#shipping" data-toggle="tab">Chi tiết gửi hàng</a></li>  
            <li><a href="#discounts" data-toggle="tab">Thông tin giảm giá</a></li>    
        </ul>
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane active in" id="general">
                <h4 class="subheader">
					Thông tin sản phẩm
				</h4>
                <div>
                    <div class="product-name">
						<div class="product-name-lb">
							Tên sản phẩm
						</div>
						<div class="product-name-tx">
							<asp:TextBox ID="txtProName" CssClass="form-control" runat="server" Columns="60" placeholder="Nhập tên"></asp:TextBox>
						</div>
					</div>
					<div class="product-nameid">
						<div class="product-nameid-lb">
							Mã sản phẩm
						</div>
						<div class="product-nameid-tx">
							<asp:TextBox ID="txtProNameId" CssClass="form-control" runat="server" Columns="20" placeholder="Nhập mã"></asp:TextBox>
						</div>
					</div>
					<div class="product-companyid">
						<div class="product-companyid-lb">
							Hãng sản xuất
						</div>
						<div class="product-companyid-drop">
                            <asp:DropDownList ID="dropCompany" CssClass="form-control" runat="server">
                                <asp:ListItem>Hãy chọn</asp:ListItem>
                                <asp:ListItem>Canon</asp:ListItem>
                                <asp:ListItem>Fuji Xerox</asp:ListItem>
                                <asp:ListItem>Ricoh</asp:ListItem>
                                <asp:ListItem>Kyocera</asp:ListItem>
                                <asp:ListItem>Toshiba</asp:ListItem>
                                <asp:ListItem>Hãng khác</asp:ListItem>
                            </asp:DropDownList>
                        </div>
                        <div class="product-companyid-id">
                            <asp:Label ID="lbCompanyId" runat="server" Visible="False"></asp:Label>
                        </div>
					</div>
                </div>
						
				<hr>
						
				<h4 class="subheader">
					Giá sản phẩm / Số lượng tồn kho
				</h4>
				<div>
					<div class="product-price">
						<div class="product-price-lb">
							Đơn giá
						</div>
						<div class="product-price-tx">
							<asp:TextBox ID="txtPrice" CssClass="form-control" runat="server" Columns="30" placeholder="Nhập đơn giá"></asp:TextBox>
						</div>
					</div>
                    <div class="product-quantity">
						<div class="product-quantity-lb">
							Số lượng
						</div>
						<div class="product-quantity-tx">
							<asp:TextBox ID="txtQuantity" CssClass="form-control" runat="server" Columns="10" placeholder="Nhập số lượng"></asp:TextBox>
						</div>
					</div>
                    <div class="product-dateimport">
						<div class="product-dateimport-lb">
							Ngày nhập hàng
						</div>
						<div class="product-dateimport-tx">
							<asp:TextBox ID="txtDateImport" CssClass="form-control datepicker" runat="server" Columns="20" placeholder="Ngày nhập hàng"></asp:TextBox>
						</div>
					</div>
				</div>

                <%--<h4 class="subheader">
					Hình ảnh
				</h4>
                <asp:ScriptManager runat="server" id="ScriptManager1"></asp:ScriptManager>
                <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
        	    <ContentTemplate>
                    <div class="row">
                        <div class="col-md-6">
                            <asp:FileUpload ID="UploadImg" CssClass="filestyle" runat="server" />
                        </div>
                        <div class="col-md-2">
                            <asp:Button ID="btnSubmit" CssClass="btn btn-primary" runat="server" Text="Tải lên" onclick="btnSubmit_Click" />
                        </div>
                    </div>
                    <div style="margin-top:10px">
                        <asp:Repeater ID="RptImage" OnItemCommand="RptImage_ItemCommand" runat="server">
                            <ItemTemplate>
                                <div class="image-row">
                                    <div class="image-name">
                                        <asp:Label ID="lbImageName" CssClass="image-name-lb" runat="server" Text='<%#Eval("ImageName") %>'></asp:Label>
                                        <asp:Button ID="btnRemoveImage" runat="server" CssClass="close btn-close" Text="×" CommandName="RemoveImage" UseSubmitBehavior="false" />
                                    </div>
                                    <div class="image-url">
                                        <img class="img-responsive" src="\Images\<%#Eval("ImageName") %>" style="width:100px;height:auto;">
                                    </div>
                                </div>
                            </ItemTemplate>
                        </asp:Repeater>
                    </div>
        	    </ContentTemplate>
                    <Triggers>
                        <asp:PostBackTrigger ControlID="btnSubmit" />
                    </Triggers>
                </asp:UpdatePanel>

                <hr>--%>
                      						
          	           
            </div>
            <div class="tab-pane fade" id="options">
                    
                
                <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
                    <ContentTemplate>
					    <div class="titlemainoption">
						    <div class="row">
							    <div class="col-md-4">
								    <asp:TextBox ID="txtMainOption" CssClass="titlemainoption-txt form-control" runat="server"></asp:TextBox>
							    </div>
							    <div class="">
								    <asp:Button ID="btnAddMainOption" CssClass="btn btn-info" runat="server" Text="Thêm Chức Năng Chính" OnClick="btnAddMainOption_Click" />
							    </div>
						    </div>
					    </div>
                        <div class="row">
                            <div class="col-md-4">
                                <asp:DropDownList ID="ddlistTitleMainOption" CssClass="form-control" runat="server" ></asp:DropDownList>
                            </div>
                        </div>

                        <div class="options">
                            <div class="option-name">
                                <asp:TextBox ID="txtOptionName" CssClass="form-control" runat="server"></asp:TextBox>
                            </div>
                            <div class="option-option">
                                <asp:TextBox ID="txtOption" CssClass="form-control" runat="server"></asp:TextBox>
                            </div>
                            <div class="option-button">
                                <asp:Button ID="btnAddOption" CssClass="btn btn-info" runat="server" Text="Thêm Chức Năng" OnClick="btnAddOption_Click" />
                            </div>
                        </div>
                    
                        <asp:Repeater ID="RptOptions" runat="server" OnItemCommand="RptOptions_ItemCommand">
                            <HeaderTemplate>
                                <table class="table table-hover" id="table">
				                    <thead>
                                        <tr>
                                            <th>#</th>
                                            <th>Mã Chức Năng Chính</th>
                                            <th>Tên Chức Năng Chính</th>
							                <th>Tên Chức Năng</th>
							                <th>Chi Tiết Chức Năng</th>
							                <th class="image-button">Edit/Delete</th>
						                </tr>
					                </thead>
					                <tbody>
                            </HeaderTemplate>
                            <ItemTemplate>
                                    <tr>
                                        <td><%#Eval("OptionID") %></td>
                                        <td><%#Eval("MainOptionID") %></td>
                                        <td><%#Eval("MainOptionName") %></td>
                                        <td><asp:Label ID="lbOptionName" runat="server" Text='<%#Eval("OptionName") %>' /><asp:TextBox ID="txtOptionNameUpdate" runat="server" Visible="false" Text='<%#Eval("OptionName") %>'></asp:TextBox></td>
                                        <td><asp:Label ID="lbOptions" runat="server" Text='<%#Eval("Options") %>' /><asp:TextBox ID="txtOptionUpdate" runat="server" Visible="false" Text='<%#Eval("Options") %>'></asp:TextBox></td>                                            
                                        <td class="image-button">                                 
                                            <asp:ImageButton ID="imgBtnEdit" ImageUrl="~/Images/Edit.png" CommandName="Edit" CommandArgument="<%#Container.ItemIndex %>" runat="server" />
                                            <asp:Button ID="btnUpdate" CssClass="btn btn-success" runat="server" Visible="false" Text="Update" CommandName="Update" CommandArgument="<%#Container.ItemIndex %>" />
                                            <asp:ImageButton ID="imgBtnDelete" ImageUrl="~/Images/Delete.png" CommandName="Delete" CommandArgument="<%#Container.ItemIndex %>" runat="server" />
                                        </td>
                                    </tr>
                            </ItemTemplate>
                            <FooterTemplate>
                                    </tbody>
                                </table>
                            </FooterTemplate>
                        </asp:Repeater>
                        <h4><asp:Label ID="lblOptionMessage" runat="server" CssClass="label label-danger" Visible="false" Text=""></asp:Label></h4>
                    
                    </ContentTemplate>
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="btnAddMainOption" EventName="Click">
                        </asp:AsyncPostBackTrigger>
                        <asp:AsyncPostBackTrigger ControlID="btnAddOption" EventName="Click">
                        </asp:AsyncPostBackTrigger>
                    </Triggers>
                </asp:UpdatePanel>
                
                

            </div>
            <div class="tab-pane fade" id="shipping">
    	            
        	    <div class="shipping-properties">
                    <div class="package-weight">
                        <div class="package-weight-lb">
                            <asp:Label ID="lblPackageWeight" runat="server" Text="Khối lượng"></asp:Label>
                        </div>
                        <div class="package-weight-tx">
                            <asp:TextBox ID="txtPackageWeight" CssClass="form-control width-40" placeholder="kg" runat="server"></asp:TextBox>
                        </div>
                    </div>
                    <div class="free-shipping">
                        <div class="free-shipping-lb">
                            <asp:Label ID="lblFreeShipping" runat="server" Text="Miễn phí vận chuyển"></asp:Label>
                        </div>
                        <div class="free-shipping-cb">
                            <asp:CheckBox ID="cbFreeShipping" runat="server" />
                        </div>
                    </div>
                    <div class="shipping-freight">
                        <div class="shipping-freight-lb">
                            <asp:Label ID="lblShippingFreight" runat="server" Text="Phí vận chuyển"></asp:Label>
                        </div>
                        <div class="shipping-freight-tx">
                            <asp:TextBox ID="txtShippingFreight" CssClass="form-control" placeholder="VNĐ" runat="server"></asp:TextBox>
                        </div>
                    </div>
                    <div class="package-length">
                        <div class="package-length-lb">
                            <asp:Label ID="lblPackageLength" runat="server" Text="Chiều dài hộp"></asp:Label>
                        </div>
                        <div class="package-length-tx">
                            <asp:TextBox ID="txtPackageLength" CssClass="form-control width-40" placeholder="cm" runat="server"></asp:TextBox>
                        </div>
                    </div>
                    <div class="package-height">
                        <div class="package-height-lb">
                            <asp:Label ID="lblPackageHeight" runat="server" Text="Chiều cao hộp"></asp:Label>
                        </div>
                        <div class="package-height-tx">
                            <asp:TextBox ID="txtPackageHeight" CssClass="form-control width-40" placeholder="cm" runat="server"></asp:TextBox>
                        </div>
                    </div>
                    <div class="package-width">
                        <div class="package-width-lb">
                            <asp:Label ID="lblPackageWidth" runat="server" Text="Chiều rộng hộp"></asp:Label>
                        </div>
                        <div class="package-width-tx">
                            <asp:TextBox ID="txtPackageWidth" CssClass="form-control width-40" placeholder="cm" runat="server"></asp:TextBox>
                        </div>
                    </div>
        	    </div>   
    	            
            </div>
            <div class="tab-pane fade" id="discounts">
    	        <asp:UpdatePanel ID="UpdatePanel2" runat="server">        
                    <ContentTemplate>    
        	            <div class="discount">
                            <div class="quantity-discount">
                                <div class="quantity-lb">
                                    <asp:Label ID="lbQuantityDiscount" runat="server" Text="Quantity"></asp:Label>
                                </div>
                                <div class="quantity-tx">
                                    <asp:TextBox ID="txtQuantityDiscount" CssClass="form-control width-40" runat="server"></asp:TextBox>
                                </div>
                            </div>
                            <div class="value-discount">
                                <div class="value-discount-lb">
                                    <asp:Label ID="lbValueDiscount" runat="server" Text="Value"></asp:Label>
                                </div>
                                <div class="value-discount-tx">
                                    <asp:TextBox ID="txtValueDiscount" CssClass="form-control" runat="server"></asp:TextBox>
                                </div>
                                <div class="value-discount-drop">
                                    <asp:DropDownList ID="dropValueDiscount" CssClass="form-control" runat="server">
                                        <asp:ListItem>VNĐ</asp:ListItem>
                                        <asp:ListItem>%</asp:ListItem>
                                    </asp:DropDownList>
                                </div>
                            </div>
                            <div class="user-group">
                                <div class="user-group-lb">
                                    <asp:Label ID="lbUserGroup" runat="server" Text="Theo nhóm"></asp:Label>
                                </div>
                                <div class="user-group-drop">
                                    <asp:DropDownList ID="dropUserGroup" CssClass="form-control" runat="server">
                                        <asp:ListItem>All</asp:ListItem>
                                        <asp:ListItem>VIP</asp:ListItem>
                                        <asp:ListItem>Customers</asp:ListItem>
                                    </asp:DropDownList>
                                </div>
                            </div>
                            <div class="button-adddiscount">
                                <asp:Button ID="btnAddDiscount" runat="server" CssClass="btn btn-info" Text="Thêm chi tiết" OnClick="btnAddDiscount_Click" />
                            </div>                       
        	            </div>
                        <asp:Repeater ID="RptDiscount" runat="server" OnItemCommand="RptDiscount_ItemCommand">
                            <HeaderTemplate>
                                <table class="table table-hover" id="table">
				                    <thead>
                                        <tr>
                                            <th>Số lượng</th>
                                            <th class="align-right">Giá trị</th>
							                <th class="align-center">Theo nhóm</th>
							                <th class="image-button">Delete</th>
						                </tr>
					                </thead>
					                <tbody>
                            </HeaderTemplate>
                            <ItemTemplate>                                   
                                        <tr>
                                            <td><%#Eval("Quantity") %></td>
                                            <td class="align-right"><%#Eval("Value") %></td>
                                            <td class="align-center"><%#Eval("UserGroup") %></td>
                                            <td class="image-button">                                 
                                                <asp:ImageButton ID="imgBtnDelete" ImageUrl="~/Images/Delete.png" CommandName="Delete" CommandArgument="<%#Container.ItemIndex %>" runat="server" />
                                            </td>
                                        </tr>                                
                            </ItemTemplate>
                            <FooterTemplate>
                                    </tbody>
                                </table>
                            </FooterTemplate>
                        </asp:Repeater>
    	            </ContentTemplate>
                    <Triggers>
                        <asp:AsyncPostBackTrigger ControlID="btnAddDiscount" EventName="Click" />
                    </Triggers>
                </asp:UpdatePanel>
            </div>
				
		</div>
        <div class="btn-insert-product">
            <asp:Button ID="btnInsertProduct" runat="server" CssClass="btn1" OnClick="btnInsertProduct_Click" Text="Thêm sản phẩm" />
        	<asp:Button runat="server" ID="btnReset" class="btn1" OnClick="btnReset_Click" Text="Làm mới"></asp:Button>
               
        </div>
        
        <div id="dialog" style="display:none">  
            Click OK button for asp.net postback event  
        </div>  
        

    
    </form>

    <%--<script type="text/javascript">
        $(":file").filestyle({ buttonBefore: true, buttonName: "btn-danger", buttonText: "Chọn ảnh" });
       
    </script>--%>
    <script type="text/javascript">
        $('.datepicker').datepicker({
            format: 'mm/dd/yyyy'
        })
        
    </script>

</asp:Content>
